import React from 'react'
import './Journey.css'

export default function Journey (props) {
  const {from, to, exchangeFromTo, clickShowCity} = props
  return (
    <div className="journey">
      <div className="journey-station" onClick={() => clickShowCity(true)}>
        <input type="text" readOnly name="from" value={from} className="journey-input journey-from"/>
      </div>
      <div className="journey-switch" onClick={() => exchangeFromTo()}>
        <img src={require('./imgs/switch.svg')} width="70" height="40" />
      </div>
      <div className="journey-station" onClick={() => clickShowCity(false)}>
      <input type="text" readOnly name="to" value={to} className="journey-input journey-to"/>
      </div>
    </div>
  )
}